<template>


  <SearchTablePage :search-config="baseTableSearchModel" :table-config="baseTableModel" />

</template>

<script lang="tsx" setup>
defineOptions({
  name: 'SupplierInfoPageData',   //全局别名
  title: '表格页',   //标题
});
import SupplierInfoTypeApi from '/@/api/webPath/SupplierInfoTypeApi';
// 接口
import SupplierInfoApi from '/@/api/webPath/SupplierInfoApi.ts';


import FORM_FIELD_TYPE from '/@/constants/FormFieldType';
import VDialog from '/@/utils/dialogUtil.ts'
import { useTemplateName } from '~/src/utils/useTemplateName';
import { onMounted, ref, watch } from 'vue'

const router = useRouter();
const baseTable = ref(null as any);
const baseTableSearch = ref(null as any);
const editRef = ref<any>(null);
const supplierTypeList = ref([])
const exportXlsName = useTemplateName("template_type_2")

onMounted(async () => {
  const data = (await SupplierInfoTypeApi.getSupplierTypeList()).data
  // console.log("supplier Type List1111111111111111:", data)
  supplierTypeList.value = data.map(item => ({ label: item.name, value: item.type }))
  // console.log("supplier Type List 222222:", supplierTypeList.value);
  getlist()
})

const data = { _current: 1, _size: 10 }
const typelisr = ref()
function getlist() {
  SupplierInfoApi.getPageDatas(data).then((res) => {
    console.log(111111, res);
    typelisr.value = res.data.records
    console.log("type list:", typelisr.value);

  })
}
// async function handleTemplateDownload() {
//   console.log("template download data ", "templateName: ", templateName, " templateUrl: ", templateUrl)
//   SupplierInfoApi.downloadAttachment(templateUrl, templateName)
// }

// 表格搜索初始化searchModel
const baseTableSearchModel = ref({
  columnCount: 4,
  expandLimit: 6,
  autoFit: true,
  columnWidth: '320px',
  labelPosition: 'right',
  labelWidth: '100px',
  items: [ //搜索项初始化

    {
      label: "供应商编号",
      field: "supplierNo",
      clearable: true,
      type: FORM_FIELD_TYPE.INPUT,

      placeholder: "请输入",

    },
    // {
    //   label: "创建人",
    //   field: "creatorName",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    // },
    {
      label: "供应商名称",
      field: "supplierName",
      clearable: true,
      type: FORM_FIELD_TYPE.INPUT,

      placeholder: "请输入",

    },

    {
      label: "类型",
      field: "supplierType",
      clearable: true,
      type: FORM_FIELD_TYPE.SINGLE_LAYER_SELECT,
      options: supplierTypeList,
      placeholder: "请输入"

    },

    // {
    //             label: "所属企业",
    //             field: "companyId",
    //             clearable: true,
    //             type: FORM_FIELD_TYPE.INPUT,

    //            placeholder:"请输入",

    //         },

    // {
    //   label: "联系人",
    //   field: "supplinerContacts",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    // },

    // {
    //   label: "联系电话",
    //   field: "supplinerPhone",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    // },

    // {
    //   label: "地址",
    //   field: "supplierAdd",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    // },

    //  {
    //              label: "来源：console，company",
    //              field: "sourceType",
    //              clearable: true,
    //              type: FORM_FIELD_TYPE.INPUT,

    //             placeholder:"请输入",

    //          },

    {
      label: "社会信用代码",
      field: "creditCode",
      clearable: true,
      type: FORM_FIELD_TYPE.INPUT,

      placeholder: "请输入",

    },

    // {
    //   label: "经营许可证",
    //   field: "businessCode",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    // },
    // {
    //   label: "生产许可证",
    //   field: "produceCode",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    // },

    // {
    //   label: "统一社会信用代码签发日期",
    //   field: "creditSignDate",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.DATE_RANGE,
    //   placeholder: "请输入",

    //   config: {
    //     props: {   //日期精度配置
    //       type: "daterange",
    //       startPlaceholder: "开始日期",
    //       endPlaceholder: "结束日期",
    //       format: "YYYY-MM-DD",
    //     }
    //   },
    // },

    // {
    //   label: "统一社会信用代码许可证类型",
    //   field: "creditType",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,
    //   placeholder: "请输入",

    // },

    // {
    //   label: "统一社会信用代码许可证类型名称",
    //   field: "creditTypeName",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    // },


    // {
    //   label: "经营许可证签发日期",
    //   field: "businessSignDate",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.DATE_RANGE,
    //   placeholder: "请输入",

    //   config: {
    //     props: {   //日期精度配置
    //       type: "daterange",
    //       startPlaceholder: "开始日期",
    //       endPlaceholder: "结束日期",
    //       format: "YYYY-MM-DD",
    //     }
    //   },
    // },

    // {
    //   label: "经营许可有效期",
    //   field: "businessEffectiveDate",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.DATE_RANGE,
    //   placeholder: "请输入",

    //   config: {
    //     props: {   //日期精度配置
    //       type: "daterange",
    //       startPlaceholder: "开始日期",
    //       endPlaceholder: "结束日期",
    //       format: "YYYY-MM-DD",
    //     }
    //   },
    // },

    // {
    //   label: "经营许可类型",
    //   field: "businessType",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    // },

    // {
    //   label: "经营许可类型名称",
    //   field: "businessTypeName",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    // },


    // {
    //   label: "生产许可证签发日期",
    //   field: "produceSignDate",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.DATE_RANGE,
    //   placeholder: "请输入",

    //   config: {
    //     props: {   //日期精度配置
    //       type: "daterange",
    //       startPlaceholder: "开始日期",
    //       endPlaceholder: "结束日期",
    //       format: "YYYY-MM-DD",
    //     }
    //   },
    // },

    // {
    //   label: "生产许可有效期",
    //   field: "produceEffectiveDate",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.DATE_RANGE,
    //   placeholder: "请输入",

    //   config: {
    //     props: {   //日期精度配置
    //       type: "daterange",
    //       startPlaceholder: "开始日期",
    //       endPlaceholder: "结束日期",
    //       format: "YYYY-MM-DD",
    //     }
    //   },
    // },

    // {
    //   label: "生产许可类型",
    //   field: "produceType",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    // },

    // {
    //   label: "生产许可类型名称",
    //   field: "produceTypeName",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    // },

    // {
    //   label: "生产许可产品类别",
    //   field: "produceClass",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    // },

    // {
    //   label: "生产许可类别编码",
    //   field: "produceClassCode",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    // },

    // {
    //   label: "生产许可类别名称",
    //   field: "produceClassName",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    // },

    // {
    //   label: "生产许可品种明细",
    //   field: "produceClassDetail",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    // },

    // { 
    //   label: "创建时间",
    //   field: "create_time",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.DATE_RANGE,
    //   placeholder: "请输入",

    //   config: {
    //     props: {   //日期精度配置
    //       type: "daterange",
    //       startPlaceholder: "开始日期",
    //       endPlaceholder: "结束日期",
    //       format: "YYYY-MM-DD",
    //     }
    //   },
    // },

  ],

  buttons: [    //功能区域


    {
      name: "新增",
      buttonClass: 'primary',
      width: 100,
      click: ({ row, handlers }) => {        // 点击回调事件方法钩子，  点击触发

        VDialog.open({
          title: '新增',

          content: { //内容初始形式
            type: 'component', //text:"",预留文本
            name: '/supplierInfo/edit',
            query: {},

          },

          callBack: (data: any) => {
            handlers.refresh()
          },
          onClose: () => {
            console.log("对话框已关闭");
          },
        });

      },
    },
    {
      name: "导入",
      buttonClass: 'primary',
      width: 100,
      click: ({ row, handlers }) => {   //暴露的方法钩子
        //  CompanyInfoApi.pageDataXls( handlers.
        VDialog.open({
          title: '导入',
          content: { //内容初始形式
            type: 'component', //text:"",预留文本
            name: '/AttachmentUpload',
            // query: { companyInfoId: row.id },
          },
          config: {
            doUpload: SupplierInfoApi.uploadExcel,
            doBatchSave: SupplierInfoApi.batchSave,
            templateType: "template_type_2"
          },
          callBack: (data: any) => {
            handlers.refresh()
            console.log("refresh", handlers.refresh)
            // handlers.refresh()
            console.log("upload recived data:", data)
          },
          onClose: () => {
            console.log("对话框已关闭");
          },
        })
      }
    },
    // {
    //   name: "批量删除",
    //   buttonClass: 'danger',
    //   width: 100,
    //   isShow: (row: any) => {
    //     return false;
    //   },
    //   click: () => {   //暴露的方法钩子
    //     console.log(baseTable.value.getSelection());
    //   },
    // },
    {
      name: "导出",
      buttonClass: 'primary',
      width: 100,
      click: ({ row, handlers }) => {   //暴露的方法钩子
        SupplierInfoApi.pageDataXls(handlers.getRequestParams(), handlers.getXlsTitle(), exportXlsName.value)
      }
    },
    // {
    //   name: "下载模板",
    //   buttonClass: 'primary',
    //   width: 100,
    //   // click: ({ row, index, handlers }) => {
    //   //   CompanyInstitutionalTemplateApi.downloadAttachment(row["templateUrl"])
    //   // // },
    //   // click: ({ row, handlers }) => {   //暴露的方法钩子
    //   //   'http://jw-pub-test.oss-cn-beijing.aliyuncs.com/df9e8c23c7b14a1ea09a04d789fd1bcd.xlsx'
    //   //   // SupplierInfoApi.pageDataXls(handlers.getRequestParams(), handlers.getXlsTitle())
    //   // }
    // },
    {
      name: "证件批量导入",
      buttonClass: 'primary',
      width: 100,
      click: ({ row, handlers }) => {   //暴露的方法钩子
        //  CompanyInfoApi.pageDataXls( handlers.getRequestParams(),handlers.getXlsTitle())
        VDialog.open({
          title: '证件批量导入',
          content: { //内容初始形式
            type: 'component', //text:"",预留文本
            name: '/BatchAttachmentUpload',
            // query: { companyInfoId: row.id },
          },
          config: {
            additionalSaveParams: { type: 2 },
            paramMessage: "请选择证件类型",
            additionalParamKey: "imgType",
            additionalParamLabel: "证件类型",
            additionalParamOptions: [
              {
                value: 1,
                label: "营业执照"
              },
              // {
              //   value: 2,
              //   label: "经营许可证"
              // },
              {
                value: 2,
                label: "供应商许可证"
              },
            ],
            templateType: "company_template_type_3",
            // tips: "注：请先选择需要上传的文件类型，图片需是png格式，选择“营业执照”是时图片命名需和“社会信用代码”保持一致，选择“经营许可证”时图片命名需和“经营许可证编码”保持一致，选择“生产许可证”时图片命名需和“生产许可证编码”保持一致。",

            // additionalParamOptions: enumList,
            // doUpload: SupplierInfoApi.excelImport,
            // doBatchSave: SupplierInfoApi.batchSave
          },
          callBack: (data: any) => {
            handlers.refresh()
            console.log("refresh", handlers.refresh)
            // handlers.refresh()
            console.log("upload recived data:", data)
          },
          onClose: () => {
            console.log("对话框已关闭");
          },
        })
      }
    },
  ]
})
// 表格初始化Model
const baseTableModel = ref({
  border: true,
  pagination: true,
  inline: true,
  selectable: true,
  isFullscreen: false,
  tooltip: true,
  minWidth: '200px',
  data: {    //table  初始化
    current: 1,
    size: 10,
    total: 100,
    data: []
  },
  requestData: { api: SupplierInfoApi.getPageData, query: {} },   //数据源 参数有效性： 'steady|transient'
  columns: [
    {
      label: "供应商编号",
      field: "supplierNo",
      width: 180,
    },
    // {
    //   label: "排序",
    //   field: "sort",
    //   width: 120,
    // },
    {
      label: "供应商类型",
      field: "supplierTypeName",
      width: 180,
    },
    {
      label: "供应商名称",
      field: "supplierName",
      // noExported: true,
      width: 180,
      tooltip: true,
    },

    //  {
    //   label: "所属企业",
    //   field: "companyId",
    //   width:120,
    //     },
    // {
    //   label: "联系人",
    //   field: "supplinerContacts",
    //   width: 180,
    // },
    // {
    //   label: "联系电话",
    //   field: "supplinerPhone",
    //   width: 180,
    // },
    {
      label: "供应商地址",
      field: "supplierAdd",
      width: 180,
      tooltip: true,

    },
    {
      label: "营业执照",
      field: "creditUrl",
      width: 180,
      tooltip: true,
      fieldFormat: 'img'

    },


    {
      label: "供应商营业执照统一社会信用代码",
      field: "creditCode",
      width: 280,
      tooltip: true,

    },
    {
      label: "供应商营业执照发证日期",
      field: "creditSignDate",
      fieldFormat: "date",
      width: 180,
    },
    {
      label: "供应商许可证类型",
      field: "licenseType",
      width: 180,
      tooltip: true,
      // fieldFormat: 'img'
    },
    // {
    //   label: "统一社会信用代码签发日期",
    //   field: "creditSignDate",
    //   width: 220,
    // },
    // {
    //   label: "统一社会信用代码许可证类型",
    //   field: "creditType",
    //   width: 220,
    // },
    // {
    //   label: "统一社会信用代码许可证类型名称",
    //   field: "creditTypeName",
    //   width: 250,
    // },
    {
      label: "供应商许可证",
      field: "produceUrl",
      width: 180,
      fieldFormat: 'img'

      // fieldFormat: 'img'
    },
    {
      label: "供应商许可证编码",
      field: "produceCode",
      width: 180,
    },

    {
      label: "供应商许可证发证日期",
      field: "produceSignDate",
      fieldFormat: "date",
      width: 200,
    },
    {
      label: "供应商许可证有效期",
      field: "produceEffectiveDate",
      fieldFormat: "date",
      width: 200,
    },
    {
      label: "供应商许可证经营项目",
      field: "produceTypeName",
      width: 200,
    },
    {
      label: "供应商产品类型",
      field: "produceClass",
      width: 180,
    },
    // {
    //   label: "供应商类别",
    //   field: "produceClass",
    //   width: 180,
    // },
    {
      label: "供应商类型编码",
      field: "produceClassCode",
      width: 200,
      tooltip: true,

    },
    {
      label: "供应商类别名称",
      field: "produceClassName",
      width: 180,
    },

    {
      label: "供应商品种明细",
      field: "produceClassDetail",
      width: 180,
    },
    {
      label: "创建时间",
      field: "create_time",
      width: 200,
    },
    {
      label: "更新时间",
      field: "update_time",
      width: 200,
    },
  ],


  actions: [
    {
      name: "详情",

      buttonClass: 'primary',
      buttonType: 'text',
      click: ({ row, index, handlers }) => {

        //router.push({name: 'CompanyInfoDetail',})
        VDialog.open({
          title: '详情',
          content: { //内容初始形式
            type: 'component', //text:"",预留文本
            name: '/supplierInfo/detail',
            query: { supplierInfoId: row.id },

          },
          callBack: (data: any) => {
            handlers.refresh()
          },
          onClose: () => {
            console.log("对话框已关闭");
          },
        });
      },
      isShow: (row: object) => {
        return true;
      },
      fixed: 'right'
    },
    {
      name: "编辑",
      buttonClass: 'primary',   //按钮颜色控制
      buttonType: 'text',      // 按钮风格   text  link  button
      isShow: (row: object) => {  //根据业务做动态隐藏张氏
        return true
      },
      click: ({ row, index, handlers }) => {        // 点击回调事件方法钩子，  点击触发

        VDialog.open({
          title: '编辑',
          content: { //内容初始形式
            type: 'component', //text:"",预留文本
            name: '/supplierInfo/edit',
            query: { supplierInfoId: row.id },

          },

          callBack: (data: any) => {
            handlers.refresh()
          },
          onClose: () => {
            console.log("对话框已关闭");
          },
        });

      },
      fixed: 'right'
    },

    {
      name: "删除",
      buttonClass: 'danger',
      buttonType: 'text',
      fixed: 'right',
      click: ({ row, index, handlers }) => {

        $baseConfirm('您确定要删除当前项吗', null, async () => {

          const { message } = await SupplierInfoApi.del({ supplierInfoIds: row.id })
          $baseMessage(message, 'success', 'vab-hey-message-success');

          handlers.refresh()

        })

      }
    },

  ]

})



onActivated(() => {
})



</script>
